<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>用户登录页面</title>

    <base th:href="@{/}">
    <script type="text/javascript" src="chat/js/vue.js"></script>
    <script type="text/javascript" src="chat/js/axios.min.js"></script>
    <script type="text/javascript" src="chat/js/vue-router.js"></script>
    <script type="text/javascript" src="chat/js/element-ui.js"></script>
    <link rel="stylesheet" type="text/css" href="chat/css/element-ui-index.css"></link>
    <script th:src="@{/static/layui/layui.js}"></script>
    <link rel="stylesheet" type="text/css" th:href="@{/static/layui/css/layui.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/static/chat/css/lgstyle.css}"/>


</head>
<body>

<div id="app">
    <br>
    <br>
    <router-view></router-view>
</div>

<!-- 用户注册界面组件 -->
<template id="register">
    <div class="dowebok" :model="form">
        <div class="layui-form form sign-in" style="margin-top:80px">
            <h2>欢迎注册HI BUG在线聊天系统</h2>
            <label>
                <span>用户名</span>
                <input type="text" placeholder="请输入用户名" id="username" v-model="form.username"  onkeyup="this.value=this.value.replace(/\s+/g,'')"/>
            </label>
            <label style="margin-top:40px">
                <span>密码</span>
                <input type="password" placeholder="请输入密码" id="password" v-model="form.password" onkeyup="this.value=this.value.replace(/\s+/g,'')"/>
            </label>
            <button type="button" class="submit" id="submitlg" style="margin-top:40px" @click="onSubmit">注册</button>
        </div>
        <div class="sub-cont">
            <div class="img">
                <div class="img__text m--up">
                    <h2>HI BUG在线聊天</h2>
                    <p>主动一点，世界会更大。</p>
                </div>
            </div>
        </div>
    </div>
</template>

<script th:src="@{/static/chat/js/register.js}"></script>
<style scoped>
    .container {
        margin-top: 200px;
        width: 100%;
        height: 100%;
    }
    .login-page {
        border-radius: 5px;
        margin: auto;
        width: 350px;
        padding: 35px 55px 15px;
        background: #fff;
        border: 1px solid #eaeaea;
        box-shadow: 0 0 25px #cac6c6;
    }
</style>
</body>
</html>